<template>
  <a-transfer
    ref="aTransferRef"
    v-model="selectedData"
    :data="data"
    :left-title="'可选城市'"
    :right-title="'已选城市'"
    :left-filters="[{ placeholder: '按城市名筛选' }]"
    :right-filters="[{ placeholder: '按城市名筛选' }]"
    :button-texts="['To left', 'To right']"
    filterable
  >
  </a-transfer>
</template>

<script lang="ts" setup>
import aTransfer from "@/components/aTransfer";
const selectedData = ref([]); // 右侧已选数据
// 全部数据
const data = ref([
  { key: "bj", label: "北京", pinyin: "beijing" },
  { key: "sh", label: "上海", pinyin: "shanghai" },
  { key: "gz", label: "广州", pinyin: "guangzhou" },
  { key: "sz", label: "深圳", pinyin: "shenzhen" },
  { key: "cd", label: "成都", pinyin: "chengdu" },
]); // 左侧未选数据

</script>

<style>
</style>